// 从 Cookie/Meta 获取 Token（需根据后端存储方式调整）
const csrftoken = document.cookie.match(/csrftoken=([^;]+)/)?.[1]
    || document.querySelector('meta[name="csrf-token"]')?.content;
// 全局设置 axios headers
axios.defaults.headers.common['X-CSRF-Token'] = csrftoken; // Laravel/Vue常用头名称
axios.defaults.headers.common['X-CSRFToken'] = csrftoken; // Django常用头名称
axios.defaults.headers.common['Content-Type'] = 'application/json'; // 格式
// 获取短信验证码初始参数
let smsCountdown = 0;
let globalTimer
let globalButton

// 初始化登录页交互
document.addEventListener('DOMContentLoaded', () => {
    // 自动聚焦用户名输入框
    document.getElementById('username')?.focus();

    // 初始化Bootstrap Tab组件
    const triggerTabList = [].slice.call(document.querySelectorAll('#loginTabs a'))
    triggerTabList.forEach(triggerEl => {
        const tabTrigger = new bootstrap.Tab(triggerEl)

        triggerEl.addEventListener('click', event => {
            event.preventDefault()
            tabTrigger.show()
        })
    })
});

// 密码登录表单提交处理
document.addEventListener('DOMContentLoaded', () => {
    document.getElementById('pwdLoginForm').addEventListener('submit', async (e) => {
        // 阻止表单的默认提交流程,才好执行自己的js提交
        e.preventDefault();

        const username = document.getElementById('username').value.trim();
        const password = document.getElementById('password').value;

        // 基础验证
        if (!username || !password) {
            // showAlert('请输齐用户名和密码', 'danger');
            showWarningModal('请输齐用户名和密码')
            return;
        }
        try {
            await axios.post('/acc/auth/loginView/', {username, password},).then(response => {
                if (Number(response?.data?.status_origin) === 210) {  // 通过自定义中间件过来的
                    handleLoginError(response);  // 错误提示框
                }else {
                    handleAuthResponse(response); // 调用函数进行本地存储和相应跳转
                }
            })
        } catch (error) {
            handleLoginError(error);
        }
    });
});

// 发送短信验证码
document.addEventListener('DOMContentLoaded', () => {
    document.getElementById('getSMSCode').addEventListener('click', async () => {
        const phone = document.getElementById('phone').value.trim();
        // const countdownElem = document.getElementById('countdown');
        globalButton = document.getElementById('getSMSCode');

        // 手机号验证
        if (!/^1[3-9]\d{9}$/.test(phone)) {
            // showAlert('请输入有效的手机号', 'danger');
            showWarningModal('请输入有效的手机号')
            return;
        }

        // 防止重复点击
        if (smsCountdown > 0) return;

        try {
            // 调用发送短信接口
            const response = await axios.post('/acc/auth/sms_send_code/', {phone, },);
            if (Number(response?.data?.status_origin) === 210){  // 通过自定义中间件过来的
                handleLoginError(response);  // 错误提示框
            }else{
            // 启动倒计时
            smsCountdown = 60;
            globalButton.disabled = true;

            globalTimer = setInterval(() => {
                smsCountdown--;
                globalButton.textContent = '倒计时中:' + `${smsCountdown}s`;
                if (smsCountdown <= 0) {
                    clearInterval(globalTimer);
                    globalButton.disabled = false;
                    globalButton.textContent = '获取验证码';
                }
            }, 1000);
            }
        } catch (error) {
            handleLoginError(error);  // 错误提示框
        }
    });
});

// 短信验证码登录处理
document.addEventListener('DOMContentLoaded', () => {
    document.getElementById('smsLoginForm').addEventListener('submit', async (e) => {
        // 阻止表单的默认提交流程,才好执行自己的js提交
        e.preventDefault();

        const phone = document.getElementById('phone').value.trim();
        const code = document.getElementById('smsCode').value.trim();

        if (!/^1[3-9]\d{9}$/.test(phone)) {
            // showAlert('手机号格式不正确', 'danger');
            showWarningModal('手机号格式不正确')
            return;
        }

        if (!/^\d{6}$/.test(code)) {
            // showAlert('请输入6位验证码', 'danger');
            showWarningModal('请输入6位验证码')
            return;
        }

        try {
            await axios.post('/acc/auth/sms_verify_code/', {phone, code}).then(response => {
              if (Number(response?.data?.status_origin) === 210) {  // 通过自定义中间件过来的
                    handleLoginError(response);  // 错误提示框
                }else {
                    handleAuthResponse(response); // 调用函数进行本地存储和相应跳转
                }
            });
        } catch (error) {
            handleLoginError(error);
            clearInterval(globalTimer);
            globalButton.disabled = false;
            globalButton.textContent = '获取验证码';
            smsCountdown = 0
        }
    });
});

// 错误处理统一方法|| error.response.data.non_field_errors[0]
function handleLoginError(error) {
    let message = ''
    if (error.response) {  // 如果没有通过中间件特殊处理的返回
        message = error.response.data.detail || '登录失败，请检查输入';
        // 处理不同错误状态码
        switch (error.response.status) {
            case 400:
                message = error.response.data.detail ||'请求参数错误';
                break;
            case 429:
                message = '操作过于频繁，请稍后再试';
                break;
            case 500:
                message = '服务器错误，请联系管理员';
                break;
        }
    }else if (error.data) {  // 通过中间件特殊处理的返回:符合逻辑的权限错误,不在控制台输出错误提示
        message = error.data.detail || '登录失败，请检查输入';
    }else if (error.request) {
        message = '网络连接失败，请检查网络';
    }

    // showAlert(message, 'danger', '.main-content');
    showWarningModal(message)
}

// 本地存储和相应跳转
function handleAuthResponse(response){
    if(!response||response.status!==200) return null;
    //存储到本地
    localStorage.setItem('access', response.data.access);
    localStorage.setItem('userInfo',JSON.stringify({
                                                          userId: response.data.userid,
                                                          roles: response.data.roles,
                                                          permissions: response.data.permissions,
                                                          is_superuser: response.data.is_superuser,}));
    //跳转到相应角色分组页面
    window.location.href=`${location.origin}${getRedirectPath()}`;
    return true
}

// 权限判断函数
function getRedirectPath() {
    const user = JSON.parse(localStorage.getItem('userInfo'));
    // 超级管理员跳转
    if (user.is_superuser) {return '/admin';}
    // 普通用户跳转
    if (user.permissions?.includes('jewelry.access_account_page')) {return '/';}
    else{
        // showAlert('您没有权限', 'danger', '.main-content');
        return '/'
    }

}

// 显示/隐藏密码
document.addEventListener('DOMContentLoaded', () => {
    document.getElementById('togglePassword').addEventListener('click', function () {
        const passwordInput = document.getElementById('password');
        const icon = this.querySelector('i');

        if (passwordInput.type === 'password') {
            passwordInput.type = 'text';
            icon.classList.replace('fa-eye', 'fa-eye-slash');
        } else {
            passwordInput.type = 'password';
            icon.classList.replace('fa-eye-slash', 'fa-eye');
        }
    });
});


// 显示小模态框时触发自动关闭
function showWarningModal(message) {
// 显示模态框
const modalEl = document.querySelector('#warningModal_login');
// const modal = bootstrap.Modal.getOrCreateInstance(modalEl);
const modal = bootstrap.Modal.getOrCreateInstance(modalEl, { backdrop: false }); // 不显示遮盖层

document.querySelector('#dynamicMessage_login').textContent = message
modal.show()
// 5秒自动关闭
setTimeout(() => { modal.hide() }, 5000);
// 点击任意位置关闭
modalEl.addEventListener('click', () => { modal.hide() });

}